import QtQuick
import QtQuick.Layouts
import QtCharts

Rectangle {
    Layout.fillWidth: true
    Layout.fillHeight: true

    ChartView {
        id: chartView
        title: "AreaSeries"
        titleFont.bold: true
        titleFont.pointSize: 14

        anchors.fill: parent
        antialiasing: true

        ValueAxis {
            id: valueAxisX
            titleText: "X Title"
        }

        ValueAxis {
            id: valueAxisY
            titleText: "Y Title"
        }

        LineSeries {
            id: line1
            XYPoint { x: 0; y: 2 }
            XYPoint { x: 1; y: 3 }
            XYPoint { x: 2; y: 5 }
            XYPoint { x: 3; y: 3 }
            XYPoint { x: 4; y: 8 }
            XYPoint { x: 5; y: 10 }
            axisX: valueAxisX
            axisY: valueAxisY

            name: "upper"
            color: "#1296FF"
            width: 1
        }

        LineSeries {
            id: line2
            XYPoint { x: 0; y: 0 }
            XYPoint { x: 1; y: 1 }
            XYPoint { x: 2; y: 2 }
            XYPoint { x: 3; y: 1 }
            XYPoint { x: 4; y: 2 }
            XYPoint { x: 5; y: 1 }
            axisX: valueAxisX
            axisY: valueAxisY

            name: "lower"
            color: "#FF9800"
            width: 1
        }

        AreaSeries {
            name: "area"

            upperSeries: line1
            lowerSeries: line2

            borderWidth: 1
            borderColor: "#999"
            // color: "#999999AA"
            brushFilename: ":/images/bg.png"

            // 点标签是否可见
            pointLabelsVisible: true

            // 控制当点标签超出绘图区域时是否被裁剪，默认为true
            // 设为false可允许标签显示在绘图区域之外，但需要注意可能布局重叠。
            pointLabelsClipping: false

            // 点标签颜色
            pointLabelsColor: "#FF0000"

            // 点标签格式
            pointLabelsFormat: "(@xPoint,@yPoint)"

            // 点标签字体
            pointLabelsFont.bold: true
            pointLabelsFont.pointSize: 9
            pointLabelsFont.family: "Courier"
        }
    }
}
